<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />

<title>LoginDemo</title>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" ></meta>
    <meta name="renderer" content="webkit"></meta>
    <title>登录</title>
	
    <link rel="stylesheet" href="css/base.css"></link>
    <link rel="stylesheet" href="css/style.css"></link>
</head>
<script>
/* $(function(){
    $("#ajaxLogin").click(function() {
        var username = $("#username").val();
        var password = $("#password").val();
        var vcode = $("#vcode").val();
        var rememberMe =$('#rememberMe').is(':checked');
        $.post("ajaxLogin", {
            "username" : username,
            "password" : password,
            "vcode" : vcode,
            "rememberMe" : rememberMe
        }, function(result) {
            if (result.status == 200) {
                location.href = "/index";
            } else {
                $("#erro").html(result.message);
            }
        });
    });
}); */
function sendAjax()
{
        var username = $("#username").val();
        var password = $("#password").val();
        var vcode = $("#vcode").val();
        var rememberMe =$('#rememberMe').is(':checked');
 $.ajax(
    {
        url:"/ajaxLogin",
        data:{"username":username,"password":password,"vcode":vcode,"rememberMe":rememberMe},
        type:"post",
        dataType:"json",
        success:function(data)
        { 
             if(data.status==200){

                 location.href = "/index";
                 // location.href = "/hosue/admin/index";
             }else if(data.status==400){
              location.href = "/lock";
             }else if(data.status==100){
            $("#erro1").html("密码错误，您还有："+data.message+" 次机会");

            }else if(data.status==600){
            $("#erro1").html("账号不存在,您还有："+data.message+" 次机会");
            }else if(data.status==300){
            $("#erro1").html("账号不存在,您还有："+data.message+" 次机会");
            }else{
             $("#erro1").html(data.message);
            }

        },
        error: function() {
            $("#erro").html("登录失败");
          }
    }); 
    }
    function change(){
     $("#codePic").attr("src","/getGifCode?flag="+Math.random());   
    }
</script>
<body>
		
    <div class="bg"></div>
    <div class="container">
        <div class="line bouncein">
            <div class="xs6 xm4 xs3-move xm4-move">
                <div style="height:150px;"></div>
                <div class="media media-y margin-big-bottom">
                </div>
                    <div class="panel loginbox">
                        <div class="text-center margin-big padding-big-top">
                            <h1>后台管理中心</h1>
                            <h4 style="color:#FF0000" id="erro1"></h4> 
                        </div>
                        <div class="panel-body" style="padding:30px; padding-bottom:10px; padding-top:10px;">
                            <div class="form-group">
                                <div class="field field-icon-right">
                                    <input type="text" class="input input-big"  name="username" id="username" value="admin" placeholder="登录账号" />
                                    <span class="icon icon-user margin-small"></span>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="field field-icon-right">
                                    <input type="password" class="input input-big" name="password" id="password"  value="123" placeholder="登录密码" />
                                    <span class="icon icon-key margin-small"></span>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="field">
                                    <input type="text" class="input input-big" id="vcode" name="vcode" placeholder="填写右侧的验证码" />
                                    <img id="codePic" src="getGifCode" onclick="change()" alt="" width="100" height="32" class="passcode" style="height:43px;cursor:pointer;" />

                                </div>
                            </div>
                            <P><input type="checkbox" name="rememberMe" id="rememberMe" />记住我</P>
                        </div>
                        <div style="padding:30px;">
                            <input type="button" onclick="sendAjax()" value="登录" id="ajaxLogin" class="button button-block bg-main text-big input-big" />
                        </div>
                    </div>
            </div>
        </div>
    </div>

</body>
</html>